<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>el属性</title>
		<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css" />
		<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/Underscore-1.8.3min.js"></script>
		<script src="js/backbone.js"></script>
		<script type="text/javascript">
		</script>
	</head>
	<body>
		<div id="search_container"> </div>
		<script type="text/template" id="search_template">
			<label>
				<%=search %>
			</label>
			<input type="text" name="search_input" id="search_input" value="" />
			<input type="button" name="" id="search_button" value="Search" />
		</script>
		<script type="text/javascript">
			 	var SearchView = Backbone.View.extend({
					initialize: function() {
						//console.log("my net name is heimiao");
					},
					render: function(content) { 
						var template = _.template($("#search_template").html())(content);
						//加载模版到对应的el属性中
						$(this.el).html(template);
					}
				});
				var searchView = new SearchView({
					el: $("#search_container")
				}); 
				searchView.render({search:"搜索渲染"}); 
				
				//这个reander 的方法可以放到 view 的构造函数中,这样初始化时就会自动渲染 
//				var tem= _.template($("#search_template").html(), {name:"黑喵"});
//				 $("#search_container").html(tem);
		</script>
	</body>

</html>